import React from 'react';
import { V } from './containers';
import { TAsyncProps } from './Types';
import { GestureResponderEvent } from 'react-native';

/**
 * 异步按钮
 * @param props 继承简写属性
 */
export function Async(props: TAsyncProps) {
  const { disableOp = 0.7, processingOp = 0.5 } = props;
  const [processing, setProcessing] = React.useState(false);
  const onPress = (evt: GestureResponderEvent) => {
    if (processing) return;
    setProcessing(true);
    props.on &&
      props.on(evt).finally(() => {
        setProcessing(false);
      });
  };
  let children: React.ReactNode = props.children;
  if (processing) {
    if (props.rp) {
      children = props.rp();
    }
  }
  let op = 1;
  if (props.disabled) op = disableOp;
  if (processing && !props.nf) op = processingOp;
  return (
    <V op={op} {...props} onPress={onPress}>
      {children}
    </V>
  );
}
